<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>小U商城</title>
    <script src="./js/remScale.js"></script>
    <link rel="stylesheet" href="./css/reset.css">
    <link rel="stylesheet" href="./css/goods.css">
    <link rel="stylesheet" href="./font/iconfont.css">
    <style>
        @font-face {
            font-family: 'iconfont';
            src: url('iconfont.ttf?t=1622789329604') format('truetype');
        }
        .iconfont {
            font-family: "iconfont" !important;
            font-size: .16rem;
            font-style: normal;
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
        }
        body{
            background-color: #fff;
            padding-bottom: 0;
        }
    </style>
</head>
<body>
    <header id="goods_header">
        <!-- 商品页面的头部 -->
        <div class="header">
            <input type="text" class="iconfont" placeholder="&#xe610;&nbsp;按内容搜索">
        </div>
        <!-- 头部的下半部分 -->
        <div class="header_bottom">
            <div>
                <a href="#">综合推荐</a>
            </div>
            <div>
                <a href="#">销量</a>
            </div>
            <div>
                <a href="#" class="iconfont">价格&#xeb13;                </a>
            </div>
            <div>
                <a href="#">好评度</a>
            </div>
            <div>
                <a href="#">店铺</a>
            </div>
            <a href="#" class="a_type iconfont">&#xe7bd;&nbsp;筛选
            </a>
        </div>
    </header>
    <!-- 筛选11.11大促商品 -->
    <p class="NiceGoods">
        筛选11.11大促商品
    </p>
    <!-- 商品 -->
    <main id="all_goods">
        <div class="single_goods">
            <div class="img">
                <img src="./images/1.png" alt="">
            </div>
            <div class="msg">
                <h2 class="textflow">溪牧原山山茶花洁面泡沫&nbsp;氨基酸后边省略</h2>
                <h3 class="textflow">敏感肌可用，控油祛痘、那女可用后边省略</h3>
                <p class="pice"><span>￥</span><strong>999</strong><del>￥1099</del><span>999人已付款</span></p>
                <p class="discount">11.11限时299元起</p>
                <p class="comment">999条评论<span>99.9%好评</span></p>
            </div>
        </div>
        <div class="single_goods">
            <div class="img">
                <img src="./images/2.png" alt="">
            </div>
            <div class="msg">
                <h2 class="textflow">水肌美男士清爽控油洗面奶&nbsp;100g后边省略</h2>
                <h3 class="textflow">净透毛孔，温和不紧绷，清爽控油</h3>
                <p class="pice"><span>￥</span><strong>999</strong><del>￥1099</del><span>999人已付款</span></p>
                <p class="discount">11.11限时299元起</p>
                <p class="comment">999条评论<span>99.9%好评</span></p>
            </div>
        </div>
        <div class="single_goods">
            <div class="img">
                <img src="./images/3.png" alt="">
            </div>
            <div class="msg">
                <h2 class="textflow">水肌美净肤洁面膏 100g/支&nbsp;深</h2>
                <h3 class="textflow">深层清洁肌肤，温和又滋润，日本</h3>
                <p class="pice"><span>￥</span><strong>199</strong><del>￥499</del><span>999人已付款</span></p>
                <p class="discount">11.11限时299元起</p>
                <p class="comment">999条评论<span>99.9%好评</span></p>
            </div>
        </div>
        <div class="single_goods">
            <div class="img">
                <img src="./images/4.png" alt="">
            </div>
            <div class="msg">
                <h2 class="textflow">多芬男士+护理净油洁面泡沫2</h2>
                <h3 class="textflow">击退油光，净在掌握，有效控油</h3>
                <p class="pice"><span>￥</span><strong>299</strong><del>￥599</del><span>999人已付款</span></p>
                <p class="discount">11.11限时299元起</p>
                <p class="comment">999条评论<span>99.9%好评</span></p>
            </div>
        </div>
        <div class="single_goods">
            <div class="img">
                <img src="./images/5.png" alt="">
            </div>
            <div class="msg">
                <h2 class="textflow">贝德玛温和卸妆水 粉水、蓝水</h2>
                <h3 class="textflow">懒人必备的四效合一卸妆水，舒缓</h3>
                <p class="pice"><span>￥</span><strong>999</strong><del>￥1099</del><span>999人已付款</span></p>
                <p class="discount">11.11限时299元起</p>
                <p class="comment">999条评论<span>99.9%好评</span></p>
            </div>
        </div>
    </main>
</body>
</html>